<template>
    <div class="success">
        <div class="success_box">
            <img src="@/assets/home/success.png" class="success_img" alt="">
            <div class="success_text">
                <div>恭喜！</div>
                <div class="success_text_tow">您已经成功注册成为作者了呦！马上开启新征程吧！</div>

            </div>
        </div>
     
        <div class="success_text_time">{{count}}s后将自动前往<span class="author_center" @click="authorCenterBtn">作者中心</span></div>

        
    </div>
</template>

<script>	
export default {
    data(){
        return{
            count:"",//倒计时
        }
    },
    methods: {
        authorCenterBtn() {
            this.$router.push("/author/center");
        }
    },
    created() {
        const TIME_COUNT = 5;
        if(!this.timer){
            this.count = TIME_COUNT;
            this.timer = setInterval(()=>{
            if(this.count > 0 && this.count <= TIME_COUNT){
                this.count--;
            }else{
                clearInterval(this.timer);
                this.timer = null;
                //跳转的页面写在此处
                this.authorCenterBtn()
            }
          },1000)
        }

    },
}
</script>

<style lang="scss" scoped="scoped">
.success_box{
    display: flex;
    align-items: center;
}
.success{
    width: 1200px;
    height: 653px;
    background: #FFFFFF;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    font-size: 18px;
}
.success_img{
    width: 80px;
    height: 80px;
}
.success_text{
    margin-left: 63px;
}
.success_text_tow{
    margin-top: 10px;
}
.success_text_time{
    margin-top: 39px;
    margin-right: 69px;
}
.author_center{
    color: #3385FD;
    cursor: pointer;
}
</style>
